

<g:vpanel height="100%" width="100%" border="1" id="main">
<g:cell style="background-color:#000000; color: #FFFFFF">Header</g:cell>
<g:cell height="100%">
<g:hsplit id="split" position="20%">
  <g:cell>
    <g:stack id="stackview" width="100%" height="100%">
    <g:cell label="Demo" open="true">
      <g:doctree root="doc:"></g:doctree>
    </g:cell>
    <g:cell label="Examples">
      <div>
        <g:action id="page" class="menu-item" value="view:file:page.html" target="editor">Form Example</g:action>
      </div>
      <hr/>      
      <g:vpanel id="someMenu">
        <g:cell>Menu</g:cell>
        <g:cell>Tools</g:cell>
        <g:cell>Resources</g:cell>
      </g:vpanel>
    </g:cell>
    <g:cell label="Links">
    <g:menu id="vmenu">
    <div>item</div>
    <g:action value="url:http://google.com" target="_blank">Google</g:action>
    <g:action value="url:http://yahoo.com" confirm="Are you sure?">Yahoo</g:action>
    <g:action value="javascript:alert('hey!')">Alert</g:action>
    <g:link action="javascript:alert('hey!')">Alert2</g:link>
    </g:menu>
    </g:cell>    
    </g:stack>
  </g:cell>
  <g:cell>
    <!-- <g:template src="file:page.html"></g:template> -->
    <g:view id="editor" tabbed="false"></g:view>
  </g:cell>
</g:hsplit>
</g:cell>
<g:cell style="background-color:#000000; color: #FFFFFF">Footer</g:cell>
</g:panel>

<!--
<g:dock style="width: 100%; height: 100%" border="1">
<g:cell position="center" height="100%">


</g:cell>
<g:cell position="north">
Header
</g:cell>
<g:cell position="south" valign="bottom">
Footer
</g:cell>
<g:cell position="west" width="20%">
west
</g:cell>
</g:dock>
-->